<template>
  <el-dialog :title="dialogProps.title" :visible.sync="dialogProps.visible" width="560px"
             @open="handleDialogOpen()" v-loading="loading">
    <!--    {{bodyModel}}-->
    <div slot="title" class="dialog-header">{{ dialogProps.title }}</div>
    <el-form :model="bodyModel" :rules="formRules"
             ref="bodyTypeForm" label-width="80px" label-position="right" size="small">
      <el-form-item v-show="dialogProps.isAdd" label="ID" prop="id">
        <el-col :span="16"><el-input ref="code" :maxlength="32" v-model="bodyModel.id" disabled ></el-input></el-col>
      </el-form-item>
      <el-form-item label="姓名" prop="name">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.name" disabled></el-input></el-col>
      </el-form-item>
      <el-form-item label="平和质" prop="tQdc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tQdc"></el-input></el-col>
      </el-form-item>
      <el-form-item label="气虚质" prop="tYadc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tYadc"></el-input></el-col>
      </el-form-item>
      <el-form-item label="阳虚质" prop="tYidc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tYidc"></el-input></el-col>
      </el-form-item>
      <el-form-item label="阴虚质" prop="tBc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tBc"></el-input></el-col>
      </el-form-item>

      <el-form-item label="痰湿质" prop="tPdc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tPdc"></el-input></el-col>
      </el-form-item>

      <el-form-item label="湿热质" prop="tDhc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tDhc"></el-input></el-col>
      </el-form-item>

      <el-form-item label="血瘀质" prop="tBsc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tBsc"></el-input></el-col>
      </el-form-item>

      <el-form-item label="气郁质" prop="tQsc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tQsc"></el-input></el-col>
      </el-form-item>

      <el-form-item label="特禀质" prop="tIsc">
        <el-col :span="16"><el-input :maxlength="32" v-model="bodyModel.tIsc"></el-input></el-col>
      </el-form-item>

    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button size="small" @click="handleDialogClose()">取 消</el-button>
      <el-button type="primary" size="small" @click="submitForm('bodyTypeForm')">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  import { updateTBodyType,saveTBodyType } from '@/api/xy/body'

  export default {
    name: 'body-edit',
    data() {
      return {
        loading: false,
        bodyModel: {},
        // test:{},
        dialogProps: {
          visible:false,
          action: '',
          title: '',
          isAdd:null
        },
        formRules: {
        }
      }
    },
    methods: {
      submitForm(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            if(this.dialogProps.action === 'add') {
              this.doSaveRole()
            } else {
              this.doUpdateRole()
            }
          } else {
            return false
          }
        });
      },
      doUpdateRole() {
        this.loading = true
        updateTBodyType(this.bodyModel.id, this.bodyModel)
          .then(response => {
            this.loading = false
            this.dialogProps.visible = false
            this.$emit('save-finished')
          })
          .catch(error => {
            this.outputError(error)
          })
      },
      doSaveRole() {
        this.loading = true
        saveTBodyType(this.bodyModel)
          .then(response => {
            this.loading = false
            this.dialogProps.visible = false
            //刷新
            this.$emit('save-finished')
          })
          .catch(error => {
            this.outputError(error)
          })
      },
      handleDialogClose() {
        this.dialogProps.visible = false;
      },
      handleDialogOpen() {
        this.$nextTick(() => {
          this.$refs['bodyTypeForm'].clearValidate()
          this.$refs['code'].focus()
        })
      },
      outputError(error) {
        console.log(error.response ? error.response : error.message)
        this.loading = false
        this.$message({
          showClose: true,
          message: '出错了，请按F12查看浏览器日志。',
          type: 'error'
        })
      }
    },
    mounted: function() {
      this.$nextTick(() => {
        this.$on("openReadBodyDialog",function (body) {
          this.bodyModel = body;
          this.dialogProps.action = 'edit'
          this.dialogProps.isAdd=true
          this.dialogProps.title = '查看详情'
          this.dialogProps.visible = true
        })
      })
    }
  }
</script>

